<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>📤 QRTransfer Sender - 文件转二维码发送工具</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <div class="container">
        <h1>📤 QRTransfer Sender</h1>
        <p style="color: #666; margin-bottom: 20px;">文件 → 二维码 分块发送</p>

        <div class="section">
            <h2>📎 选择文件</h2>
            <input type="file" id="fileInput">
            <div class="config">
                <label>每块大小：<input type="number" id="chunkSize" value="500" min="500" max="2300"> 字符</label>
            </div>
        </div>

        <div class="action">
            <button id="processBtn" disabled>⚙️ 生成二维码</button>
        </div>

        <div id="result" class="result"></div>

        <div id="qrNavigation" style="margin-top: 20px; text-align: center; display: none;">
            <div class="qr-controls">
                <button id="prevBtn" disabled>⬅️ 上一页</button>
                <span id="pageInfo">第 1 页，共 1 页</span>
                <button id="nextBtn" disabled>下一页 ➡️</button>
            </div>
            <div class="qr-size-controls">
                <label>二维码大小：
                    <select id="qrSizeSelect">
                        <option value="150">小 (150px)</option>
                        <option value="200" selected>中 (200px)</option>
                        <option value="300">大 (300px)</option>
                        <option value="400">超大 (400px)</option>
                    </select>
                </label>
            </div>
        </div>

        <div id="downloadAll" style="margin-top: 20px; text-align: center; display: none;">
            <button id="downloadAllBtn">💾 批量下载所有二维码</button>
        </div>

        <div id="log"></div>
    </div>

    <!-- 引入 pako（zlib）和 qrcode -->
    <script src="pako.min.js"></script>
    <script src="qrcode.min.js"></script>
    <script src="sender.js"></script>
</body>
</html>